const React = require( 'react' );
const { View, StyleSheet } = require( 'react-native' );
const {
    JDDevice,
    JDText,
    JDRouter,
} = require( '@areslabs/jdreact-core-lib' );
import I18n from '../language/i18n';
const { NavigationBar } = JDRouter;

class JDTextExample extends React.Component {
    moreNavList = [
        {
            icon: { uri: 'https://st.360buyimg.com/m/images/index/a-home.png' },
            text: '消息',
            handler: () => { alert('消息') },
        },
        {
            icon: { uri: 'https://st.360buyimg.com/m/images/index/n-catergry.png' },
            text: '分类',
            handler: () => { alert('分类') },
        },
        {
            icon: { uri: 'https://st.360buyimg.com/m/images/index/n-cart.png' },
            text: '购物车',
            handler: () => { alert('购物车') },
        },
        {
            icon: { uri: 'https://st.360buyimg.com/m/images/index/n-me.png' },
            text: '我的',
            handler: () => { alert('我的') },
        },
    ];
    render() {
        return (
            <View style={styles.wrapper}>
                <NavigationBar
                    showMoreNav={true}
                    moreNavList={this.moreNavList}
                    Title="JDText组件" 
                    />
                <View style={styles.content}>
                    <JDText style={styles.text}>
                        {I18n.t('greeting')}
                    </JDText>
                    <JDText style={styles.text} type={'Normal'}>
                        Normal: 0123456789
                    </JDText>
                    <JDText style={styles.text} type={'regular'}>
                        Regular: 0123456789
                    </JDText>
                    <JDText style={styles.text} type={'bold'}>
                        Bold: 0123456789
                    </JDText>
                    <JDText style={styles.text} type={'light'}>
                        Light: 0123456789
                    </JDText>
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    wrapper: {
        flex: 1,

    },
    content:{
        height:JDDevice.height,
        justifyContent:'center',
        alignItems:'center',
        paddingRight:20,
        paddingLeft:20,
    },
    text:{
        fontSize:JDDevice.getFontSize(40)
    },

});

module.exports = JDTextExample;
